<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Home</title>
<style type="text/css">
	body{ padding:20px; }
	#div1,#div3{ padding: 10px;margin: 10px;font-weight:bold}
	#div2{ padding: 10px;margin: 10px;width: 75%;background-color: #d4d4d4;}
	#PhoneBill{ border: 1px solid #848484;margin-right: 20px;}
	#generate,#clear{ margin-right: 20px;}
</style>
<script type="text/javascript">

	function clearSQL(){
		document.getElementById("div2").innerHTML = "";	
	}
	 
</script>
</head>
<body>
	<div id="div1">
		<form action="TestServlet" method="post" >
			Please choose a file:&nbsp;&nbsp;
			<input type="file" id="PhoneBill" name="PhoneBill">
			<input type="submit" id="generate" value="Generate SQL statements">
			<input type="button" id="clear" value="Clear SQL statements" onclick="clearSQL()" >
		</form>
	</div>
	<div id="div2">
		<c:forEach 	items="${sql}" var="item">	
			${item}<br>
		</c:forEach>
	</div>
	<div id="div3">
		<form action="DBServlet" method="post" >
			<input type="hidden" value="<%= request.getAttribute("sql")%>" id="sql" name="sql" >
			<input type="submit" id="insert" value="Update to Datebase">	
		</form>
	</div>
</body>
</html>